<%@ page language="java" contentType="text/html; charset=UTF-8"
	pageEncoding="UTF-8"%>
<%@ include file="/views/include/taglib.jsp"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<%@ include file="/views/include/nocachehead.jsp"%>
<%@ include file="/views/include/statusbar.jsp"%>
<title>${spotInfo.name}</title>
<script type="text/javascript"
	src="${pageContext.request.contextPath}/js/payattention.js"></script>
<script type="text/javascript"
	src="${pageContext.request.contextPath}/js/pagination.js"></script>

<script type="text/javascript"
	src="${pageContext.request.contextPath}/js/comment.js"></script>
<script type="text/javascript"
	src="${pageContext.request.contextPath}/js/jquery.raty.min.js"></script>
<script type="text/javascript"
	src="${pageContext.request.contextPath}/js/stringutil.js"></script>
<script type="text/javascript"
	src="${pageContext.request.contextPath}/js/base.js"></script>
<script type="text/javascript"
	src="${pageContext.request.contextPath}/js/feed.js"></script>
<script type="text/javascript"
	src="${pageContext.request.contextPath}/js/shortMessage.js"></script>
<script type="text/javascript"
	src="${pageContext.request.contextPath}/js/notification.js"></script>
<script type="text/javascript"
	src="${pageContext.request.contextPath}/js/video.js"></script>
<script type="text/javascript"
	src="${pageContext.request.contextPath}/js/ratyStar.js"></script>
</head>
<script type="text/javascript">

$(document).ready(function(){
//	$('#myStar').starLevel();

//	AjaxstarInit(spotStar,${spotInfo.id},${spotInfo.star});
	//alert($('#content').html().length);
	//showDepart();
});
</script>
<style type="text/css">
.mainBox1 {
	border: 1px dashed #0099CC;
	margin: 3px;
	padding: 0px;
	float: left;
	height: 800px;
	width: 700px;
}

.mainBox2 {
	border: 1px dashed #0099CC;
	margin: 3px;
	padding: 0px;
	float: left;
	height: 800px;
	width: 260px;
}

.spotView {
	border: 1px dashed #0099CC;
	margin: 3px;
	padding: 0px;
	float: left;
	height: 250px;
	width: 250px;
}

.spotStarView {
	border: 1px dashed #0099CC;
	margin: 3px;
	padding: 0px;
	float: left;
	height: 50px;
	width: 700px;
}

.spotCharView {
	border: 1px dashed #0099CC;
	margin: 3px;
	padding: 0px;
	float: left;
	height: 80px;
	width: 700px;
}

.spotPositionView {
	border: 1px dashed #0099CC;
	margin: 3px;
	padding: 0px;
	float: left;
	height: 100px;
	width: 250px;
}

.adminview {
	border: 1px dashed #0099CC;
	margin: 3px;
	padding: 0px;
	float: left;
	height: 120px;
	width: 250px;
}

.introductionView {
	border: 1px dashed #0099CC;
	margin: 3px;
	padding: 0px;
	float: left;
	height: 100px;
	width: 250px;
}

.fansView {
	border: 1px dashed #0099CC;
	margin: 3px;
	padding: 0px;
	float: left;
	height: 30px;
	width: 250px;
}

.starclass {
	font: 10px verdana;
}

#bodyDiv {
	position: relative;
	top: 42px;
	width: 960px;
	min-height: 500px;
	height: auto !important;
	margin: 0 auto;
}

#woOwnerDiv {
	float: right;
	width: 240px;
	height: 500px;
	background: #ffff;
	left: 10px;
}

#content {
	float: left;
	width: 720px;
	min-height: 500px;
	background: #ffff;
}

hr {
	boder: 1px dashed #cccccc;
}

#refrenceDigest {
	width: 640px;
	height: 100px;
	visibility: hidden;
}
</style>
<script type="text/javascript">
MyNewsDivChoose={
		shortMessage:function()
		{
			$("#shortMessageDiv").css("display","block");
			$("#photoDiv").css("display","none");
			$("#videoDiv").css("display","none");
		},
		photo:function()
		{
			$("#shortMessageDiv").css("display","none");
			$("#photoDiv").css("display","block");
			$("#videoDiv").css("display","none");
		},
		video:function()
		{
			$("#shortMessageDiv").css("display","none");
			$("#photoDiv").css("display","none");
			$("#videoDiv").css("display","block");
		}
}

function addSpotChar()
{
	$.ajax({
		url:"/skyline/spot/char/add.html",
		type:"POST",
		data:"ownerId="+${spotInfo.id}+"&charTitle="+$('#spotCharTile').val()+"&charDetail="+$('#spotCharDetail').val(),
		dataType:"json",
		contentType : "application/x-www-form-urlencoded; charset=utf-8",
		success : function(obj) {
			if (obj == null) {
			// ajaxLogin();
			} else{
				if(obj.loginStatus==false){
					$.alerts._hide();	
					ajaxLogin();
				}
				else if(obj.loginStatus==true){
					if(obj.addStaus==false){
						$.alerts._hide();	
						location.reload();
						alert("添加特色失败！");
					}else if(obj.addStaus == true){
						$.alerts._hide();	
						location.reload();
						alert("添加特色成功！");
						}
				}
			}
		}
	});	
}
function support(charId,num)
{
	$.ajax({
		url:"/skyline/spot/char/support.html",
		type:"POST",
		data:"charId="+charId,
		dataType:"json",
		contentType : "application/x-www-form-urlencoded; charset=utf-8",
		success : function(obj) {
			if (obj == null) {
			// ajaxLogin();
			}else{
				if(obj.supportStatus==true){
					alert("谢谢参与");
					num+=1;
					$('a#'+charId).css('background-color','#888888');
					$('a#'+charId).text("已支持("+num+")");
				//	$('a#'+charId).onclick(function(){});
					document.getElementById(charId).onclick='';
				}
					
			}
		}
	});	
}
function tableHide()
{
	$.alerts._hide();	
}
function setCharTable() {
	var charTable = "<table><tr><td>标题:</td><td><input type='text' id='spotCharTile'/></td></tr><tr><td>内容:</td><td><textarea rows='5' cols='30' id='spotCharDetail'></textarea></td></tr><tr><td colspan='2' align='right'><input type='button' onclick='addSpotChar()' value='提交'>&nbsp;<input type='button' onclick='tableHide()' value='取消'>&nbsp;&nbsp;</td></tr></table>";
	jMessageBox(charTable, '添加特色');
}
$(document).ready(function(){
	if(${authority}==25)
		{
		}else{
			$('a#edit').hide();
		}
	
	
});
</script>
<script charset="utf-8" src="/skyline/plugin/kindeditor/kindeditor.js"></script>
<script type="text/javascript">
			KE.show({
				id : 'refrenceDigest',
				resizeMode : 1,
				allowPreviewEmoticons : true,
				allowUpload : true,
				items : [
				'fontname', 'fontsize', '|', 'textcolor', 'bgcolor', 'bold', 'italic', 'underline',
				'removeformat', '|', 'justifyleft', 'justifycenter', 'justifyright', 'insertorderedlist',
				'insertunorderedlist', '|', 'emoticons', 'image', 'link'],
				afterCreate : function(id) {
					KE.event.ctrl(document, 13, function() {
						KE.sync(id);
						addArticleSubmit();
					});
					KE.event.ctrl(KE.g[id].iframeDoc, 13, function() {
						KE.sync(id);
						addArticleSubmit();
					});
				}
			});

		</script>
<script type="text/javascript">
		function selectDone(item)
		{
			$("#refrencePortrait").val($(item).val().split("#")[0]);
        	$("#refrenceTitle").val($(item).val().split("#")[1]);
        	$("#refrenceDigest").val($(item).val().split("#")[2]);
        	$("#refrenceId").val($(item).attr("id").split("_")[1]);
		}
</script>
<body>
	<br>
	<br>
	<div class="mainBox1">
		<p>添加特色</p>
		<form id="postAlbumForm"
			action="${pageContext.request.contextPath}/spot/ref/${spotInfo.id }/add.html"
			method="POST">
			<table width="640px">
				<tr>
					<td>标题:</td>
					<td><input id="refrenceTitle" class="Input"
						name="refrenceTitle" type="text" size="64"
						style="width: 500px; height: 20px;" /> <a>*必填</a>
					</td>

				</tr>
				<tr>
					<td><a>具体描述：</a></td>
					<td></td>
				</tr>
				<tr>

					<td colspan="2"><textarea id="refrenceDigest"
							name="refrenceDigest"></textarea></td>
				</tr>
				<tr>
					<td><input type="hidden" id="spotId" name="spotId"
						value="${spotInfo.id }" /> <input type="hidden" id="spotName"
						name="spotName" value="${spotInfo.name }" /> <input type="hidden"
						id="spotPortrait" name="spotPortrait" value="${spotInfo.portrait}" />
						<input type="hidden" id="refrenceId" name="refrenceId" value="" />
						<input type="hidden" id="refrencePortrait" name="refrencePortrait"
						value="" /> <input type="hidden" id="refrenceType"
						name="refrenceType" value="ALBUM" />
					</td>
				</tr>
				<tr>
					<td colspan="2" align="right"><input type="hidden"
						name="submitToken"
						value='<skyline:sessionAttribute key="SESSION_SUBMIT_TOKEN"/>' />
						<input type="submit" name="submit" value="提交"> <input
						type="reset" id="reset" value="取消">
					</td>
				</tr>

			</table>
		</form>
		<div class="albumView">
			<span> <c:forEach var="album" items="${albumList}" begin="0"
					end="6" step="1">
					<div>
						<a> <img title=""
							src="${portraitPath }/${album.cover}.${album.coverExt}"> </a> <input
							type="radio" name="${album.albumName}" id="album_${album.id }"
							value="${album.cover }#${album.albumName }#${album.description}"
							onclick="selectDone(this)" />${album.albumName
						}#${album.description}
					</div>
				</c:forEach> </span>
		</div>
		<script type="text/javascript">
		(function($) {
			$(document).ready(function() {
				$('#postRefForm').submit(function() {
					       
					return true;
				});
			});
		})(jQuery);
	</script>
	</div>
	<div class="mainBox2">
		<div class="spotPositionView">
			<a>${spotInfo.name }</a><br> <em>位置：</em>
			<c:if test="#{authority }"></c:if>
			<a class="countryTag"
				href="${pageContext.request.contextPath}/spot/country/${spotInfo.siteId}/list.html">${spotInfo.country}</a>
			<em class="provinceTag">›</em> <a class="provinceTag"
				href="${pageContext.request.contextPath}/spot/province/${spotInfo.siteId}/list.html">${spotInfo.province}</a><em
				class="provinceTag">›</em> <a class="provinceTag"
				href="${pageContext.request.contextPath}/spot/city/${spotInfo.siteId}/list.html">${spotInfo.city}</a><em
				class="detailTag">›</em> <a class="detailTag">${spotInfo.detailAddress}</a>
			<a id="edit"
				href="${pageContext.request.contextPath}/spot/${spotInfo.id}/edit.html">编辑</a>
		</div>
		<div class="spotView">
			<img title="${spotInfo.name}" width="240px" height="240px"
				src="${spotPortraitPath }spot/${spotInfo.portrait}" />
		</div>
		<div id="adminView" class="adminview">
			<a
				href="${pageContext.request.contextPath}/wo/${spotInfo.administratorId}.html">
				<img title="${spotInfo.administratorNickname }"
				src="${portraitPath }/${spotInfo.administratorPortrait}" /> </a>
		</div>
		<div id="introduction" class="introductionView">
			${spotInfo.introduction }
			<!--  <input type="button" id="switch" value="more" style="display :blocked">-->
		</div>
		<div id="fansView" class="fansView">
			<!-- 已有特色 -->
			<c:forEach var="sc" items="${scList}" begin="0" end="6" step="1">
				<a
					href="${pageContext.request.contextPath}/spot/chara/${sc.spotId }/${sc.id }.html">
					<img title="${sc.characteristicTitle }" width="20px" height="20px"
					src="${portraitPath }/${sc.portrait }"> </a>
			</c:forEach>

		</div>
	</div>
</body>
</html>